import React, {type FC} from 'react';
import {ModalForm, ProForm, ProFormDateRangePicker, ProFormTextArea} from "@ant-design/pro-components";

type ReportGenerateModalProps = {
  modalVisible: boolean;
  onOpenChange: (open: boolean) => void;
  onSubmit: (sessionTime: string[], familyId: number, reportPrompt?: string) => void;
  familyId: number;
};

const ReportGenerateModal: FC<ReportGenerateModalProps> = (props) => {
  const {modalVisible, onOpenChange, onSubmit, familyId} = props;

  return (
    <ModalForm
      title="手动生成报告"
      open={modalVisible}
      onOpenChange={onOpenChange}
      width={600}
      onFinish={async (values) => {
        console.log('values', values);
        onSubmit(values.sessionTime, familyId, values.reportPrompt);
        return true;
      }}
      modalProps={{
        okText: '生成报告',
      }}
    >
      <ProForm.Group style={{width: '100%'}} direction="vertical">
        <ProFormDateRangePicker
          name="sessionTime"
          width='xl'
          label="会话时间范围"
          rules={[
            {
              required: true,
              message: '请选择会话范围',
            },
          ]}
          placeholder={['开始日期', '结束日期']}
        />
        {/* <ProFormTextArea
          label="提示词"
          width='xl'
          name="reportPrompt"
          fieldProps={{
            autoSize: {minRows: 5, maxRows: 20},
          }}
        /> */}
      </ProForm.Group>
    </ModalForm>
  );
};

export default ReportGenerateModal;
